<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			
			
			body{
				margin: 0;
				padding: 0;
			}
			input{
				
				border: 1px solid red;
				
				padding-left: 10px;
				
				font-size: 10px;
			}
			
			#outer{
				
				width: 200px;
				
				height: 200px;
				
				border:1px solid red;
				
				
				position: absolute;
				
				/*距离上边的距离*/
				top:20px;
				left: 20px;
				
				
				/*绝对定位如果父元素[包括父元素的父元素]没有定位属性,此时相对的body标签*/
				
				/*如果父元素有定位  相对的是父元素 如果有定位属性 会从文档流中删除自己本身占住的地盘*/
				
				
			}
			
			#inner{
				width: 100px;
				
				height: 100px;
				
				background-color: blue;
				
				
				/*相对于自己*/
				position: absolute;
				
				/*原来的位置在我的左边20px*/
				left: -20px;
				top: 20px;
				
				/*margin-top: 20px;
				margin-left: 20px;*/
			}
		</style>
	</head>
	<body>
		aa
		<div id="outer">
			<div id="inner">110</div>
		</div>
		bb
	</body>
</html>
